
<template>
  <view class="user">
    <view class="userheader">
        <view class="header flex">
          <image class="left" v-if="store.getToken" :src="getImgUrl(dataInfo.head_image)"  mode="scaleToFill" />
          <image class="left" v-else :src="store.confige.wechat.share_img"  mode="scaleToFill" @click="goLogin" />
          <view class="right" v-if="store.getToken">
            <view class="name flex flex-align">{{dataInfo.name}} <image class="leveimg" :src="getImgUrl(memberInfo.label_icon)"  mode="scaleToFill" /></view>
            <view class="Id flex flex-align">
              <view class="flex flex-align">ID:{{dataInfo.id}} <image @click="copy(dataInfo.id)" class="leveimg" src="@/static/user/user02.png"  mode="scaleToFill" /></view>
              <view class=" flex flex-align">邀请码：{{ dataInfo.invite_code }} <image class="leveimg" @click="copy(dataInfo.invite_code)" src="@/static/user/user02.png"  mode="scaleToFill" /></view>
            </view>
          </view>
          <view class="right flex flex-align" v-else @click="goLogin">
            <text class="Id" style="font-size: 30rpx;">请登录</text>
          </view>
          <view class="tihuo flex flex-align" @click="openTihuo" >
            <image src="@/static/user/user03.png"  mode="scaleToFill" />
            <view>提货码</view>
          </view>
        </view>
        <view class="leveBg flex flex-align flex-bt">
          <view class="left flex flex-align">
            <image class="leveImg" :src="getImgUrl(memberInfo.label_icon)"  mode="scaleToFill" />
            <view class="jibie">
              <image class="Img" src="@/static/levelcenter/level19.png"  mode="scaleToFill" />
              <view class="jindu">
                <view class="jinduBg">
                  <view class="jinduNum" style="width:0%"></view>
                </view>
              </view>
              <view class="flex flex-align flex-bt">
                <view>再消费20元可升至V1</view>
                <view>0/200</view>
              </view>
            </view>
          </view>
          <!-- <view class="right flex flex-align flex-center" @click="menuJump({is_tab: false,link: '/pages/user/levelCenter',link_type: 1})">会员中心</view> -->
        </view>
    </view>
    <view class="userNav">
      <view class="navList flex">
        <view class="list flex-1" @click="menuJump({is_tab: false,link: '/pages/orderList/orderList?type=1',link_type: 1})">
          <image class="Img" src="@/static/user/user15.png"  mode="scaleToFill" />
          <view>待付款</view>
          <uni-badge class="num" :text="orderList?.wait_pay" type="error"></uni-badge>
        </view>
        <view class="list flex-1" @click="menuJump({is_tab: false,link: '/pages/orderList/orderList?type=2',link_type: 1})">
          <image class="Img" src="@/static/user/user19.png"  mode="scaleToFill" />
          <view>待发货</view>
          <uni-badge class="num" :text="orderList?.wait_ship" type="error"></uni-badge>
        </view>
        <view class="list flex-1" @click="menuJump({is_tab: false,link: '/pages/orderList/orderList?type=3',link_type: 1})">
          <image class="Img" src="@/static/user/user16.png"  mode="scaleToFill" />
          <view>待收货</view>
          <uni-badge class="num" :text="orderList?.wait_receive" type="error"></uni-badge>
        </view>
        <view class="list flex-1" @click="menuJump({is_tab: false,link: '/pages/orderList/orderList?type=4',link_type: 1})">
          <image class="Img" src="@/static/user/user17.png"  mode="scaleToFill" />
          <view>已完成</view>
          <uni-badge class="num" :text="orderList?.complete" type="error"></uni-badge>
        </view>
        <view class="list flex-1" @click="menuJump({is_tab: false,link: '/pages/orderList/orderList?type=5',link_type: 1})">
          <image class="Img" src="@/static/user/user18.png"  mode="scaleToFill" />
          <view>退款售后</view>
          <uni-badge class="num" :text="orderList?.service" type="error"></uni-badge>
        </view>
      </view>
      <view class="signka flex">
        <view class="flex-1 flex flex-align flex-bt" @click="menuJump({is_tab: false,link: '/pages/index/sigin',link_type: 1})">
          <view class="left">
            <view class="title">每日签到</view>
            <view class="miaoshu">{{dataInfo.is_clock_in?'今日已完成签到':'今日还未签到哦'}}</view>
          </view>
          <image class="right" src="@/static/user/user21.png"  mode="scaleToFill" />
        </view>
        <view class="flex-1 flex flex-align flex-bt" @click="menuJump({is_tab: false,link: '/pages/user/coupon',link_type: 1})">
          <view class="left">
            <view class="title">我的卡券</view>
            <view class="miaoshu">{{dataInfo.coupon_num}}张券待使用</view>
          </view>
          <image class="right" src="@/static/user/user20.png"  mode="scaleToFill" />
        </view>
      </view>
    </view>
    <view class="userListNav">
      <view class="homeTitle"><text>其他功能</text></view>
      <view class="navList flex flex-line">
        <view class="list" v-for="(item,index) in toolList" :key="index" @click="menuJump({is_tab: false,link: item.page_url,link_type: 1})">
          <image class="Img" :src="getImgUrl(item.icon_url)"  mode="scaleToFill" />
          <view>{{item.page_name}}</view>
        </view>
        <view class="list" @click="menuJump({is_tab: false,link: '/pages/team/applyteam',link_type: 1})" v-if="dataInfo.level_id==1">
          <image class="Img" src="@/static/user/user06.png"  mode="scaleToFill" />
          <view>申请团长</view>
        </view>
        <view class="list" @click="menuJump({is_tab: false,link: '/pages/team/teamshuju',link_type: 1})" v-if="dataInfo.level_id==2">
          <image class="Img" src="@/static/user/user06.png"  mode="scaleToFill" />
          <view>团长中心</view>
        </view>
        <view class="list" @click="menuJump({is_tab: false,link: '/pages/team/teamshuju',link_type: 1})" v-if="dataInfo.level_id==3">
          <image class="Img" src="@/static/user/user06.png"  mode="scaleToFill" />
          <view>合作中心</view>
        </view>
        <view class="list" v-if="store.storeInfo.pickup==2" @click="menuJump({is_tab:false,link:'/pages/address/address',link_type:1})">
          <image class="Img" src="@/static/user/user07.png"  mode="scaleToFill" />
          <view>地址管理</view>
        </view>
        <view class="list">
          <image class="Img" src="@/static/user/user08.png"  mode="scaleToFill" />
          <view>在线客服</view>
        </view>
        <view class="list" @click="menuJump({is_tab:false,link:'/pages/setting/feedback',link_type:1})">
          <image class="Img" src="@/static/user/user09.png"  mode="scaleToFill" />
          <view>意见反馈</view>
        </view>
        <view class="list" @click="menuJump({is_tab: false,link: '/pages/setting/question',link_type: 1})">
          <image class="Img" src="@/static/user/user10.png"  mode="scaleToFill" />
          <view>常见问题</view>
        </view>
        <view class="list" @click="menuJump({is_tab: false,link: '/pages/setting/setting',link_type: 1})">
          <image class="Img" src="@/static/user/user11.png"  mode="scaleToFill" />
          <view>系统设置</view>
        </view>
        <!-- <view class="list" @click="menuJump({is_tab: false,link: '/pages/user/share',link_type: 1})">
          <image class="Img" src="@/static/user/user12.png"  mode="scaleToFill" />
          <view>分享好友</view>
        </view> -->
        <!-- <view class="list" @click="menuJump({is_tab: false,link: '/pages/user/redlimit',link_type: 1})">
          <image class="Img" src="@/static/user/user13.png"  mode="scaleToFill" />
          <view>红包额度</view>
        </view> -->
      </view>
    </view>
    <tihuoCode ref="tihuoCodeRef"></tihuoCode>
    <TabBar :tabBarShow="2"></TabBar>
  </view>
</template>
<script setup>
import TabBar from '@/components/TabBar/TabBar.vue';
import { onReady,onShow,onLoad } from "@dcloudio/uni-app";
import { copy, getImgUrl, menuJump,wxShare} from "@/utils/tools"
import tihuoCode from './components/tihuoCode.vue'
import { useAuthStore } from '@/stores/counter'
import { ref } from 'vue';
import { userWallet,orderStatus } from '@/api/user';

onReady(() => {
  uni.hideTabBar();
});
onLoad(()=>{
  // getWallet()
})
onShow(() => {
  if(store.getToken){
    store.getUserInfo().then((res)=>{
      dataInfo.value = res
      memberInfo.value =configes.value.find(item => Number(item.id) === Number(dataInfo.value.member_id))
    })
    getOrderStatus()
    wxShare('', 1);
  }
});
const memberInfo = ref({})
const dataInfo =ref({})
const tihuoCodeRef = ref(null)
const store=useAuthStore();
const openTihuo = async ()=>{
  tihuoCodeRef.value?.open()
}
const configes = ref(store.confige.member)
const toolList = ref([])
toolList.value = store.confige.navigation.filter(item => item.type === 2 && item.status === 1);
// 用户钱包

function getWallet(){
  userWallet({current_type_id:6}).then((res)=>{
    console.log(res)
  })
}
function goLogin(){
  uni.reLaunch({
    url: '/pages/login/login'
  })
}
// 获取订单状态
const orderList = ref()
function getOrderStatus(){
  orderStatus().then((res)=>{
    orderList.value = res
  })
} 
</script>
 
<style scoped lang="scss">
.userListNav{background: #fff;margin: 20rpx;padding: 20rpx;border-radius: 15rpx;
  .navList{
    .list{width: 25%;text-align:center;position: relative;margin-bottom:30rpx;
      image{width: 64rpx;height: 64rpx;}
      view{font-size: 24rpx;}
    }
  }
}
.userNav{
  background: #fff;border-radius: 20rpx;padding: 50rpx 0 20rpx;margin-top:-150rpx;
  .navList{
    .list{width: 25%;text-align:center;position: relative;
      image{width: 64rpx;height: 64rpx;}
      view{font-size: 24rpx;}
      .num{position: absolute;top: -10rpx;right: 30rpx;}
    }
  }
  .signka{padding: 20rpx 30rpx;margin-top:20rpx;
    .right{width: 90rpx;height: 90rpx;}
    .flex-1{background: linear-gradient(to right,#FFF4E6,#FFDCCC);padding: 20rpx;border-radius: 20rpx;margin-right: 20rpx;}
    .flex-1:last-child{margin-right: 0;}
    .left{
      .title{font-size: 30rpx;color: #7B3800;font-weight: bold;}
      .miaoshu{font-size: 24rpx;color: #C39B83;margin-top: 6rpx;}
    }
  }
}
.userheader{padding:60rpx 30rpx 0;
  box-sizing: border-box;
  .header{position: relative;
    .left{width: 130rpx;height: 130rpx;border-radius: 100%;margin-right: 20rpx;}
    .right{
      .name{margin:10rpx 0 20rpx;font-size:32rpx;font-weight: bold;
        .leveimg{width: 48rpx;height: 48rpx;}
      }
      .Id{color: #969799;font-size:12px;
        .flex{margin-right: 20rpx;}
        .leveimg{width: 32rpx;height: 32rpx;}
      }
    }
    .tihuo{position: absolute;right:-30rpx;top: 0;background: #fff;height: 70rpx;width: 140rpx;font-size: 24rpx;padding-left: 20rpx;
      border-radius: 70rpx 0 0 70rpx;
      image{width: 48rpx;height: 48rpx;margin-right: 6rpx;}
    }
  }
  background: url('@/static/user/user01.png') no-repeat;background-size: 100% 100%;width: 100%;height: 520rpx;
  .leveBg{background: url('@/static/levelcenter/level20.png') no-repeat;background-size: 100% 100%;width: 660rpx;height: 128rpx;margin: 50rpx auto 0;color: #969799;
    padding-right: 20rpx;
    .left{
      .leveImg{width: 128rpx;height: 128rpx;}
      .jibie{font-size: 24rpx;width: 520rpx;
        .jindu{margin-bottom: 10rpx;
          .jinduBg{width: 100%;height: 8rpx;background: #fff;border-radius: 8rpx;
            .jinduNum{height: 8rpx;background: linear-gradient(to right,#D4D4D4,#9B9B9B);border-radius: 8rpx;}
          }
        }
        .Img{width: 186rpx;height: 46rpx;}
      }
    }
    .right{width: 128rpx;height: 48rpx;background: linear-gradient(to right,#FFE7B3,#C1843E);color: #323232;font-size: 22rpx;border-radius: 48rpx;}
  }
}
.homeTitle{
    margin: 10rpx 0 30rpx 10rpx;
  }
</style>
